import Toast from '@vant/weapp/toast/toast';
import { userModifyAvatarService, userModifyUserDescriptionService, userModifyUserGenderService, userModifyUserNameService, userModifyUserQQIdService, userModifyUserWeChatIdService, userWxLoginService, userLogout } from "../../api/userService"
import { createStoreBindings } from 'mobx-miniprogram-bindings'
import { tokenStore } from '../../stores/tokenStore'
import { currentUserStore } from '../../stores/currentUserStore'
import { formatDateTime } from '../../utils/timeUtil'

Page({
  data: {
    currentUserCreateTime: '',
    newUserName: '',
    newUserGender: '0',
    newUserDescription: '',
    newUserWeChatId: '',
    newUserQQId: '',
    showModifyUserName: false,
    showModifyUserGender: false,
    showModifyUserDescription: false,
    showModifyUserWeChatId: false,
    showModifyUserQQId: false
  },

  onLoad(options) {
    this.tokenStoreBinding = createStoreBindings(this, {
      store: tokenStore,
      fields: ['token'],
      actions: ['updateToken']
    })
    this.currentUserStoreBinding = createStoreBindings(this, {
      store: currentUserStore,
      fields: ['id', 'username', 'gender', 'avatar', 'description', 'openId', 'wechatId', 'tags', 'createTime', 'qqId'],
      actions: ['updateUserName', 'updateGender', 'updateAvatar', 'updateDescription', 'updateWeChatId', 'updateQQId', 'updateTags', 'updateCurrentUser', 'clearData']
    })
  },

  // 登录按钮点击事件
  onLoginTap() {
    wx.login({
      success: async (res) => {
        const code = res.code
        // 调用后端的login方法，获取用户信息等
        const result = await userWxLoginService(code)
        // console.log(result)
        this.setData({
          newUserGender: result.data.gender + '',
          currentUserCreateTime: formatDateTime(result.data.createTime)
        })
        this.updateToken(result.data.token)
        this.updateCurrentUser(result.data)
      },
    })
  },

  async onChooseAvatar(e) {
    const { avatarUrl } = e.detail 
    this.setData({
      avatar: avatarUrl
    })
    this.updateAvatar(avatarUrl)
    // 更改用户头像
    const result = await userModifyAvatarService(avatarUrl)
    if (result.code === 200) {
      Toast.success('头像修改成功')
    }
  },

  async modifyUserName() {
    // console.log(this.data.newUserName)
    const result = await userModifyUserNameService(this.data.newUserName)
    if (result.code === 200) {
      Toast.success('用户名修改成功')
      this.setData({
        username: this.data.newUserName
      })
      this.updateUserName(this.data.newUserName)
    }
    this.setData({
      showModifyUserName: false,
      newUserName: ''
    })
  },

  async modifyUserGender() {
    // console.log(this.data.newUserGender)
    const result = await userModifyUserGenderService(this.data.newUserGender)
    if (result.code === 200) {
      Toast.success('用户性别修改成功')
      this.setData({
        gender: parseInt(this.data.newUserGender)
      })
      this.updateGender(parseInt(this.data.newUserGender))
    }
    this.setData({
      showModifyUserGender: false
    })
  },

  async modifyUserDescription() {
    // console.log(this.data.newUserDescription)
    const result = await userModifyUserDescriptionService(this.data.newUserDescription)
    if (result.code === 200) {
      Toast.success('个人简介修改成功')
      this.setData({
        description: this.data.newUserDescription
      })
      this.updateDescription(this.data.newUserDescription)
    }
    this.setData({
      newUserDescription: '',
      showModifyUserDescription: false
    })
  },

  async modifyUserWeChatId() {
    const result = await userModifyUserWeChatIdService(this.data.newUserWeChatId)
    if (result.code === 200) {
      Toast.success('微信号修改成功')
      this.setData({
        wechatId: this.data.newUserWeChatId
      })
      this.updateWeChatId(this.data.newUserWeChatId)
    }
    this.setData({
      newUserWeChatId: '',
      showModifyUserWeChatId: false
    })
  },

  async modifyUserQQId() {
    const result = await userModifyUserQQIdService(this.data.newUserQQId)
    if (result.code === 200) {
      Toast.success('QQ号修改成功')
      this.setData({
        qqId: this.data.newUserQQId
      })
      this.updateQQId(this.data.newUserQQId)
    }
    this.setData({
      newUserQQId: '',
      showModifyUserQQId: false
    })
  },

  modifyUserTags() {
    wx.navigateTo({
      url: '/pages/modifyTags/modifyTags'
    })
  },

  async logout() {
    const result = await userLogout(this.data.openId)
    this.clearData()
    this.updateToken('')
  },

  onUnload() {
    // 页面卸载时销毁store实例
    this.tokenStoreBinding.destroyStoreBindings()
    this.currentUserStoreBinding.destroyStoreBindings()
  },

  // 以下函数全都和弹出层开启和关闭有关
  showUserNamePopup() {
    this.setData({
      showModifyUserName: true,
      newUserName: ''
    })
  },

  onUserNameClose() {
    this.setData({
      showModifyUserName: false,
      newUserName: ''
    })
  },

  onUserNameChange(e) {
    this.setData({
      newUserName: e.detail.value
    })
  },

  showUserGenderPopup() {
    this.setData({
      showModifyUserGender: true,
    })
  },

  onUserGenderClose() {
    this.setData({
      showModifyUserGender: false
    })
  },

  onUserGenderChange(e) {
    this.setData({
      newUserGender: e.detail + ''
    })
  },

  showUserDescriptionPopup() {
    this.setData({
      showModifyUserDescription: true,
      newUserDescription: ''
    })
  },

  onUserDescriptionClose() {
    this.setData({
      showModifyUserDescription: false,
      newUserDescription: ''
    })
  },

  onUserDescriptionChange(e) {
    this.setData({
      newUserDescription: e.detail
    })
  },

  showUserWeChatId() {
    this.setData({
      showModifyUserWeChatId: true,
      newUserWeChatId: ''
    })
  },

  onUserWeChatIdClose() {
    this.setData({
      showModifyUserWeChatId: false,
      newUserWeChatId: ''
    })
  },

  onUserWeChatIdChange(e) {
    this.setData({
      newUserWeChatId: e.detail
    })
  },

  showUserQQId() {
    this.setData({
      showModifyUserQQId: true,
      newUserQQId: ''
    })
  },

  onUserQQIdClose() {
    this.setData({
      showModifyUserQQId: false,
      newUserWeChatId: ''
    })
  },

  onUserQQIdChange(e) {
    this.setData({
      newUserQQId: e.detail
    })
  }
})
